<template>
	<view>
		<u-sticky>
			<view style="padding: 15px; background-color: #fff;">
				<u-subsection :list="tabs" mode="button" :current="tabIdx" activeColor="#000" @change="tabChange">
				</u-subsection>
				<view class="flex-row justify-center group">
					<text class="font text_2">总收益</text>
					<text class="ml-8 text_3">{{report.grand.toFixed(2)}}元</text>
				</view>
			</view>

		</u-sticky>
		<view class="flex-col page">
			<view class="flex-col">
				<view class="flex-col list">
					<view class="flex-col mt-8 list-item" v-if="report.AG_SHOP_PROFIT">
						<view class="flex-row items-center group_2">
							<view class="section_4"></view>
							<text class="ml-6 font text_4">银店铺收益</text>
						</view>
						<view style="padding: 20rpx;">
							<u-cell-group :border="false">
								<u-cell title="单数" :value="report.AG_SHOP_PROFIT.orderCount+''">

								</u-cell>
								<u-cell title="收益" :value="report.AG_SHOP_PROFIT.amount.toFixed(2)" :border="false">

								</u-cell>
							</u-cell-group>
						</view>

					</view>
					<view class="flex-col mt-8 list-item" v-if="report.AU_SHOP_PROFIT">
						<view class="flex-row items-center group_2">
							<view class="section_4"></view>
							<text class="ml-6 font text_4">金店铺收益</text>
						</view>
						<view style="padding: 20rpx;">
							<u-cell-group :border="false">
								<u-cell title="单数" :value="report.AU_SHOP_PROFIT.orderCount+''">

								</u-cell>
								<u-cell title="收益" :value="report.AU_SHOP_PROFIT.amount.toFixed(2)" :border="false">

								</u-cell>
							</u-cell-group>
						</view>

					</view>
					<view class="flex-col mt-8 list-item" v-if="report.AG_WHS_GAIN">
						<view class="flex-row items-center group_2">
							<view class="section_4"></view>
							<text class="ml-6 font text_4">银批发收益</text>
						</view>
						<view style="padding: 20rpx;">
							<u-cell-group :border="false">
								<u-cell title="单数" :value="report.AG_WHS_GAIN.orderCount+''">

								</u-cell>
								<u-cell title="收益" :value="report.AG_WHS_GAIN.amount.toFixed(2)" :border="false">

								</u-cell>
							</u-cell-group>
						</view>

					</view>
					<view class="flex-col mt-8 list-item" v-if="report.AU_WHS_GAIN">
						<view class="flex-row items-center group_2">
							<view class="section_4"></view>
							<text class="ml-6 font text_4">金批发收益</text>
						</view>
						<view style="padding: 20rpx;">
							<u-cell-group :border="false">
								<u-cell title="单数" :value="report.AU_WHS_GAIN.orderCount+''">

								</u-cell>
								<u-cell title="收益" :value="report.AU_WHS_GAIN.amount.toFixed(2)" :border="false">

								</u-cell>
							</u-cell-group>
						</view>

					</view>
					<view class="flex-col mt-8 list-item" v-if="report.AG_AGENT_GAIN">
						<view class="flex-row items-center group_2">
							<view class="section_4"></view>
							<text class="ml-6 font text_4">银代理收益</text>
						</view>
						<view style="padding: 20rpx;">
							<u-cell-group :border="false">
								<u-cell title="单数" :value="report.AG_AGENT_GAIN.orderCount+''">

								</u-cell>
								<u-cell title="收益" :value="report.AG_AGENT_GAIN.amount.toFixed(2)" :border="false">

								</u-cell>
							</u-cell-group>
						</view>

					</view>
					<view class="flex-col mt-8 list-item" v-if="report.AU_AGENT_GAIN">
						<view class="flex-row items-center group_2">
							<view class="section_4"></view>
							<text class="ml-6 font text_4">金代理收益</text>
						</view>
						<view style="padding: 20rpx;">
							<u-cell-group :border="false">
								<u-cell title="单数" :value="report.AU_AGENT_GAIN.orderCount+''">

								</u-cell>
								<u-cell title="收益" :value="report.AU_AGENT_GAIN.amount.toFixed(2)" :border="false">

								</u-cell>
							</u-cell-group>
						</view>

					</view>
					<view class="flex-col mt-8 list-item" v-if="report.MANAGER_GAIN">
						<view class="flex-row items-center group_2">
							<view class="section_4"></view>
							<text class="ml-6 font text_4">经理收益</text>
						</view>
						<view style="padding: 20rpx;">
							<u-cell-group :border="false">
								<u-cell title="单数" :value="report.MANAGER_GAIN.orderCount+''">

								</u-cell>
								<u-cell title="收益" :value="report.MANAGER_GAIN.amount.toFixed(2)" :border="false">

								</u-cell>
							</u-cell-group>
						</view>

					</view>
					<view class="flex-col mt-8 list-item" v-if="report.AG_DIRECTOR_GAIN">
						<view class="flex-row items-center group_2">
							<view class="section_4"></view>
							<text class="ml-6 font text_4">总监收益</text>
						</view>
						<view style="padding: 20rpx;">
							<u-cell-group :border="false">
								<u-cell title="单数" :value="report.AG_DIRECTOR_GAIN.orderCount+''">

								</u-cell>
								<u-cell title="收益" :value="report.AG_DIRECTOR_GAIN.amount.toFixed(2)" :border="false">

								</u-cell>
							</u-cell-group>
						</view>

					</view>
					<view class="flex-col mt-8 list-item" v-if="report.AU_DIRECTOR_GAIN">
						<view class="flex-row items-center group_2">
							<view class="section_4"></view>
							<text class="ml-6 font text_4">董事收益</text>
						</view>
						<view style="padding: 20rpx;">
							<u-cell-group :border="false">
								<u-cell title="单数" :value="report.AU_DIRECTOR_GAIN.orderCount+''">

								</u-cell>
								<u-cell title="收益" :value="report.AU_DIRECTOR_GAIN.amount.toFixed(2)" :border="false">

								</u-cell>
							</u-cell-group>
						</view>

					</view>
				</view>


				<view class="flex-col list_2">
					<!-- 			<view class="flex-row justify-between items-center group_5">
						<view class="flex-row items-center">
							<image class="shrink-0 image_2" src='/static/icons/product.png' />
							<text class="ml-14 font">产品数据查询</text>
						</view>
						<u-icon name="arrow-right"></u-icon>
					</view> -->
					<view class="flex-row justify-between items-center group_5" @click="goAgencyReport">
						<view class="flex-row items-center">
							<image class="shrink-0 image_2" src='/static/icons/agency.png' />
							<text class="ml-14 font">分销数据汇总</text>
						</view>
						<u-icon name="arrow-right"></u-icon>
					</view>
					<view class="flex-row justify-between items-center group_5" @click="goTeamReport">
						<view class="flex-row items-center">
							<image class="shrink-0 image_2" src='/static/icons/team.png' />
							<text class="ml-14 font">团队业绩查询</text>
						</view>
						<u-icon name="arrow-right"></u-icon>
					</view>
					<view class="flex-row justify-between items-center group_5" style="border-bottom: 0;"
						@click="goMyCustomer">
						<view class="flex-row items-center">
							<image class="shrink-0 image_2" src='/static/icons/customerinterests.png' />
							<text class="ml-14 font">我邀请的客户</text>
						</view>
						<u-icon name="arrow-right"></u-icon>
					</view>
				</view>
			</view>
		</view>
		<s-page-tabbar :show-report="true" :current="2"></s-page-tabbar>
	</view>
</template>

<script>
	import Utils from '../../common/Utils';

	export default {
		components: {},
		props: {},

		data() {
			return {
				tabIdx: 2,
				tabs: [],
				report: {},
			};
		},
		onLoad() {
			let curdate = new Date();
			let today = curdate.getDate()
			let yesterday = new Date(curdate.setDate(curdate.getDate() - 1)).getDate()
			let secondDay = new Date(curdate.setDate(curdate.getDate() - 1)).getDate()
			this.tabs = [secondDay + "日", yesterday + "日", today + "日", '本月', '上月']

		},
		onShow() {
			this.reload()
		},

		methods: {
			goMyCustomer() {
				uni.navigateTo({
					url: '/pages-users/MyCustomer/MyCustomer'
				})
			},
			reload() {
				this.tabIdx = 2;
				let curdate = new Date();
				let today = curdate.getDate()
				let yesterday = new Date(curdate.setDate(curdate.getDate() - 1)).getDate()
				let secondDay = new Date(curdate.setDate(curdate.getDate() - 1)).getDate()
				this.tabs = [secondDay + "日", yesterday + "日", today + "日", '本月', '上月']
				this.getProfitsAndGains();
			},
			tabChange(e) {
				this.tabIdx = e;
				console.log(e)
				this.getProfitsAndGains()
			},
			getProfitsAndGains() {
				let search = {};
				if (this.tabIdx == 0) {
					let today = new Date();
					let yesterday = new Date(today.setDate(today.getDate() - 1))
					let secondDay = new Date(yesterday.setDate(yesterday.getDate() - 1))

					search = {
						start: Utils.formatDate(secondDay, 'yyyy-MM-ddT00:00:00'),
						end: Utils.formatDate(secondDay, 'yyyy-MM-ddT23:59:59')
					}
				} else if (this.tabIdx == 1) {
					let today = new Date();
					let yesterday = new Date(today.setDate(today.getDate() - 1))

					search = {
						start: Utils.formatDate(yesterday, 'yyyy-MM-ddT00:00:00'),
						end: Utils.formatDate(yesterday, 'yyyy-MM-ddT23:59:59')
					}
				} else if (this.tabIdx == 2) {
					let today = new Date();

					search = {
						start: Utils.formatDate(today, 'yyyy-MM-ddT00:00:00'),
						end: Utils.formatDate(today, 'yyyy-MM-ddT23:59:59')
					}
				} else if (this.tabIdx == 3) {
					let today = new Date();

					search = this.getCurrentMonthDates()
				} else if (this.tabIdx == 4) {
					let today = new Date();

					search = this.getLastMonthDates()
				}
				console.log(search)
				this.$get({
					url: `${this.$Utils.ApiUrl}/profitsAndGains`,
					data: search
				}).then(res => {
					console.log(res)
					this.report = res;
				})
			},
			getCurrentMonthDates() {
				const today = new Date();
				const firstDayOfMonth = new Date(today.getFullYear(), today.getMonth(), 1);
				const lastDayOfMonth = new Date(today.getFullYear(), today.getMonth() + 1, 0);

				return {
					start: Utils.formatDate(firstDayOfMonth, 'yyyy-MM-ddT00:00:00'),
					end: Utils.formatDate(lastDayOfMonth, 'yyyy-MM-ddT23:59:59')
				};
			},
			goAgencyReport() {
				uni.navigateTo({
					url: '/pages-reports/AgencyReport/AgencyReport'
				})
			},
			goTeamReport() {
				uni.navigateTo({
					url: '/pages-reports/TeamRepost/TeamRepost'
				})
			},
			getLastMonthDates() {
				const now = new Date();
				const firstDay = new Date(now.getFullYear(), now.getMonth() - 1, 1);
				// 获取上个月的最后一天（本月第0天就是上个月最后一天）
				const lastDay = new Date(now.getFullYear(), now.getMonth(), 1);
				return {
					start: Utils.formatDate(firstDay, 'yyyy-MM-ddT00:00:00'),
					end: Utils.formatDate(lastDay, 'yyyy-MM-ddT23:59:59'),
					firstDayStr: firstDay.toISOString().split('T')[0],
					lastDayStr: lastDay.toISOString().split('T')[0]
				};

			}

		}

	};
</script>

<style scoped lang="scss">
	.mt-13 {
		margin-top: 22.67rpx;
	}

	.mt-193 {
		margin-top: 336.63rpx;
	}

	.ml-55 {
		margin-left: 95.93rpx;
	}

	.group {
		padding: 38.84rpx 0 18.37rpx;

		.text_2 {
			line-height: 22.4rpx;
		}

		.text_3 {
			color: #ff0101;
			font-size: 31.4rpx;
			font-family: SourceHanSansCN;
			line-height: 23.79rpx;
		}
	}

	.page {
		background-color: #f2f2f2;
		width: 100%;
		overflow-y: auto;
		overflow-x: hidden;
		height: 100%;

		.image {
			width: 100vw;
			height: 25.5814vw;
		}

		.section {
			padding: 10.47rpx 41.86rpx 0;
			background-color: #ffffff;

			.section_2 {
				padding: 6.98rpx 66.28rpx;
				background-color: #ebebeb;
				border-radius: 5.23rpx;

				.text {
					color: #575757;
					font-size: 20.93rpx;
					font-family: SourceHanSansCN;
					line-height: 24.42rpx;
					width: 40.12rpx;
				}

				.pos {
					position: absolute;
					left: 65.37rpx;
					top: 50%;
					transform: translateY(-50%);
				}

				.section_3 {
					background-color: #ffffff;
					width: 92.44rpx;
					height: 36.63rpx;
				}
			}


		}

		.list {
			padding: 12.21rpx 0 22.67rpx;

			.list-item {
				padding: 6.98rpx 0 24.42rpx;
				background-color: #ffffff;

				&:first-child {
					margin-top: 0;
				}

				.group_2 {
					padding: 10rpx 22.67rpx;

					.section_4 {
						background-color: #ff0101;
						border-radius: 3.49rpx;
						width: 6.98rpx;
						height: 36.63rpx;
					}

					.text_4 {
						line-height: 22.48rpx;
						font-size: 32rpx;
					}
				}

				.group_3 {
					padding: 0 73.26rpx;

					.font_2 {
						font-size: 28.42rpx;
						font-family: SourceHanSansCN;
						line-height: 29.65rpx;
						color: #000000;
					}

					.text_5 {
						width: 47.09rpx;
					}

					.font_3 {
						font-size: 24.42rpx;
						font-family: SourceHanSansCN;
						line-height: 29.65rpx;
						color: #ff0101;
					}

					.text_6 {
						margin-left: 13.95rpx;
						width: 12.21rpx;
					}
				}
			}
		}

		.font {
			font-size: 28.42rpx;
			font-family: SourceHanSansCN;
			line-height: 22.66rpx;
			color: #000000;
		}

		.list_2 {
			padding: 0 34.88rpx;
			background-color: #ffffff;

			.group_5 {
				padding: 6.98rpx 0 17.44rpx;
				border-bottom: solid 1.74rpx #d4d4d4;

				.image_2 {
					width: 55.81rpx;
					height: 55.81rpx;
				}

				.image_3 {
					margin-right: 13.95rpx;
					width: 34.88rpx;
					height: 34.88rpx;
				}
			}
		}

		.section_6 {
			padding: 12.21rpx 0 50.58rpx;
			background-color: #fafafa;

			.equal-division-item {
				width: 48.84rpx;
				height: 48.84rpx;
			}
		}
	}
</style>